<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>加班登记</title>
    <link rel="stylesheet" href="../../lib/bootstrap-3.4.1-dist/css/bootstrap.css">
    <link rel="stylesheet" href="../../css/zuZhiGuanLi--wangHeng/zuZhiGuanLiDaoHang.css">
    <link rel="stylesheet" href="../../iconfont/iconfont.css">
    <link rel="stylesheet" href="../../css/nav.css">
    <link rel="stylesheet" href="../../css/header_nav.css">
    <link rel="stylesheet" href="../../css/kaoQinGuanLi--JiangPeng/public.css">
    <script src="../../lib/jquery/jquery-3.6.0.js"></script>
    <script src="../../lib/bootstrap-3.4.1-dist/js/bootstrap.js"></script>


    <style>
       
       /* .shanchu_table{

       } */
   </style>
</head>

<body>

    <div class="modal fade" tabindex="-1" role="dialog">
        <div class="modal-dialog" role="document">
          <div class="modal-content">
            <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
              <h4 class="modal-title">确认提示</h4>
            </div>
            <div class="modal-body">
              <p>退出系统确认</p>
              <p>确认要退出登录吗?</p>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
              <button type="button" class="btn btn-primary outlogin">确定</button>
            </div>
          </div>
        </div>
      </div>
      <header class="clearfix">
        <div class="row">
            <div class="col-md-7 col-xs-7">
                <img src="../../iconfont-img/yuan.png" alt="">
                <h4>教师人力资源管理系统</h4>
            </div>
            <div class="col-md-5 col-xs-5">
                <div class="row">
                    <div class="col-md-4 col-xs-4">
                        <div id="search_name">
                            <input type="text" placeholder="请输入员工姓名"><span class="iconfont icon-search2"></span>
                        </div>
    
                    </div>
                    <div class="col-md-6 col-xs-6">
                        <div class="row">
                            <div class="col-md-3 col-xs-3">
                                <div>
                                    <span class="iconfont icon-table_fill"></span>事项
                                    <div id="matter_div">
                                        <div>待办事项</div>
                                        <div class="row">
                                            <div class="col-md-6 col-xs-6">
                                                ●今日待审批请假申请（<span class="matter_num">0</span>）
                                            </div>
                                            <div class="col-md-6 col-xs-6">
                                                ●今日待审批加班申请（<span class="matter_num">0</span>）
                                            </div>
                                            <div class="col-md-6 col-xs-6">
                                                ●待处理的劳动合同续签（<span class="matter_num">0</span>）
                                            </div>
                                            <div class="col-md-6 col-xs-6">
                                                ●今日审批的出差申请（<span class="matter_num">0</span>）
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-3 col-xs-3">
                                <a href="../sider_nav/date.html"><span class="iconfont icon-kaoqin"></span>日历</a>
                            </div>
                            <div class="col-md-3 col-xs-3">
                                <a href=""><span class="iconfont icon-kaoqin"></span>消息</a>
                            </div>
                            <div class="col-md-3 col-xs-3">
                                <a href="../sider_nav/lock.html"><span class="iconfont icon-kaoqin"></span>锁屏</a>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-2 col-xs-2" id="user_div">
                        <div>
                            <span class="iconfont icon-ren"></span><span class='username'></span><span class="iconfont icon-shanglajiantou"></span>
                            <div id="pull_down">
                                <div><a href="../sider_nav/changemsg.html">修改资料</a></div>
                                <div><a href="../sider_nav/changeimg.html">修改头像</a></div>
                                <div><a href="../sider_nav/changepwd.html">修改密码</a></div>
                                <div class="logout"><a href="../sider_nav/login.html">退出登录</a></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </header>
    <div class="row" id="main">
        <nav id="nav_left" class="col-md-2 col-xs-2">
            <ul>
                <li><a href="../xitongshouye--shikaiwen/shouye.html"><span class="iconfont icon-jurassic_home"></span>系统首页</a></li>
                <li><a href="../zuZhiGuanLi--wangHeng/zuZhiGuanLiDaoHang.html"><span class="iconfont icon-daifenpei"></span>组织管理</a></li>
                <li><a href="../zhaoPinGuanLi--songJiaYu/zhaoPinGuanLiShouYe.html"><span class="iconfont icon-ren"></span>招聘管理</a></li>
                <li><a href="../renshiguanli/renshiguanlidaohang.html"><span class="iconfont icon-sangeren"></span>人事管理</a></li>
                <li><a href="../kaoQinGuanLi--JiangPeng/kaoQinGuanLi.html"><span class="iconfont icon-kaoqin"></span>考勤管理</a></li>
                <li><a href="../xinchouFuLi--Heyinhua/xinchouFuLishouye.html"><span class="iconfont icon-shipin-sige"></span>薪酬福利</a></li>
                <li><a href="../../pages/xitongshouye--shikaiwen/gonggao.html"><span class="iconfont icon-laba"></span>通知公告</a></li>
                <li><a href="../XiTongGuanLi/XiTong.html"><span class="iconfont icon-shezhi"></span>系统管理</a></li>
            </ul>
        </nav>
        <div class="content_nav col-md-10 col-xs-10">
            <!-- 这个是内容上面带房子的导航栏 -->
            <div class="pull-left">
                <a href=""><span class="iconfont icon-jurassic_home"></span></a>
                <span class="iconfont icon-youjiantou"></span>一级分类
                <span class="iconfont icon-youjiantou"></span>加班登记
            </div>
            <div class="pull-right">
                <a href=""><span class="iconfont icon-zuojiantou"></span></a>
                <a href=""><span class="iconfont icon-zhongzhi"></span></a>
            </div>
        </div>
        <div class="col-md-10 col-xs-10" id="content">
            <!-- 这里面装的内容 -->
            <div class="container">
                <div class="row">
                    <div class="col-md-1 col-xs-1">
                        <input type="text" placeholder="工号" class="nav_input1" id="sousuo_id">
                    </div>
                    <div class="col-md-1 col-xs-1">
                        <input type="text" placeholder="姓名" class="nav_input1" id="sousuo_name">
                    </div>
                    <!-- <div class="col-md-2 col-xs-2">
                        <select name="" class="nav_input">
                            <option value="0">部门</option>
                            <option value="10">财务部</option>
                            <option value="20">人事部</option>
                            <option value="30">技术部</option>
                            <option value="40">采购部</option>
                            <option value="50">销售部</option>
                        </select>
                    </div> -->
                    <!-- <div class="col-md-2 col-xs-2">
                        <select name="" class="nav_input">
                            <option value="0">数据来源</option>
                            <option value="10">补卡审批</option>
                            <option value="20">补卡申请</option>
                            <option value="30">考勤机打卡</option>
                            <option value="40">钉钉打卡</option>
                            <option value="50">APP定位</option>
                            <option value="60">在线考勤</option>
                        </select>
                    </div>
                    <div class="col-md-2 col-xs-2">
                        <select name="" class="nav_input">
                            <option value="0">进出标识</option>
                            <option value="10">进卡</option>
                            <option value="20">出卡</option>
                        </select>
                    </div> -->
                    <div class="col-md-7 col-xs-7"></div>
                    <div class="col-md-3 col-xs-3">
                        <div>
                            <button class="blue_btn btn" id="ss"><span class="iconfont icon-search2"></span>查询</button>
                            <button class="white_btn btn" id="reset"><span class="iconfont icon-zhongzhi"></span>重置</button>
                            <span class="blue_span btn"><span class="iconfont icon-loudou"></span>高级筛选</span>
                        </div>
                    </div>
                </div>
                <hr>
                <div class="row">
                    <div class="col-md-1 col-xs-1">
                        <button class="blue_btn btn" data-toggle="modal" data-target="#xinzeng"><span class="iconfont icon-jiahao"></span>新增</button>
                    </div>
                    <!-- <div class="col-md-1 col-xs-1">
                        <button class="blue_btn1 btn" style="width: 90px;">批量补卡</button>
                    </div>
                    <div class="col-md-3 col-xs-3">
                        <button class="blue_btn1 btn" style="width: 120px;">读取刷卡数据</button>
                        <button class="white_btn btn"><span class="iconfont icon-daoru"></span>导入 <span class="iconfont icon-shanglajiantou"></span></button>
                    </div> -->
                </div>
                <table class="mytable table table-striped table-hover" id="mytable" >
                    <thead>
                        <tr>
                            <td class="wid_151">加班序号<span class="iconfont icon-shangxiajiantou11"></span></td>
                            <td class="wid_151">工号<span class="iconfont icon-shangxiajiantou11"></span></td>
                            <td class="wid_151">姓名<span class="iconfont icon-shangxiajiantou11"></span></td>
                            <td class="wid_151">加班申请类别<span class="iconfont icon-shangxiajiantou11"></span></td>
                            <td class="wid_151">加班时长<span class="iconfont icon-shangxiajiantou11"></span></td>
                            <td class="wid_151">操作</td>
                        </tr>
                    </thead>
                    <tbody>

                    </tbody>
                </table>

                <!-- 分页 -->
                <div class="row table_page">
                    <nav aria-label="Page navigation" class="col-md-3 col-xs-3" style="float: right;">
                        <ul class="pagination" id="pages">
                            <li id="pre">
                                <a href="#" aria-label="Previous">
                                    <span aria-hidden="true">&laquo;</span>
                                </a>
                            </li>
                            <!-- <li class="active"><a href="#">1</a></li>
                            <li><a href="#">2</a></li>
                            <li><a href="#">3</a></li>
                            <li><a href="#">4</a></li>
                            <li><a href="#">5</a></li> -->
                            <li id="next">
                                <a href="#" aria-label="Next">
                                    <span aria-hidden="true">&raquo;</span>
                                </a>
                            </li>
                        </ul>
                    </nav>
                    <!-- <div class="col-md-1 col-xs-1 page_num">
                        <ul>
                            <li>
                                <select name="" id="page_num" style="width:100%;height:100%;">
                                    <option value="10">10条/页</option>
                                    <option value="15">15条/页</option>
                                    <option value="20">20条/页</option>
                                    <option value="25">25条/页</option>
                                </select>
                            </li>
                            <li value="10" >10条/页<span class="iconfont icon-arrow-down"></span></li>
                            <li value="15">15条/页</li>
                            <li value="20">20条/页</li>
                            <li value="25">25条/页</li>
                        </ul>
                    </div> -->
                </div>
            </div>
        </div>
    </div>
    
    <div id="motaikuang1">
        <!-- 增加 -->
        <div class="modal fade" tabindex="-1" role="dialog" id="xinzeng">
            <div class="modal-dialog" role="document">
              <div class="modal-content">
                <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                  <h4 class="modal-title">新增</h4>
                </div>
                <div class="modal-body">
                    <div class="row gao60">
                        <div class="col-md-2 col-xs-2 wid_101 juzhong">
                            工号：
                        </div>
                        <div class="col-md-8 col-xs-8">
                            <input type="text"  class="leixing yuangong_id" placeholder="请输入员工ID">
                        </div>
                      </div>
    
                      <div class="row gao60">
                        <div class="col-md-2 col-xs-2 wid_101 juzhong">
                            姓名：
                        </div>
                        <div class="col-md-8 col-xs-8">
                            <input type="text"  class="leixing yuangong_name" placeholder="请输入姓名">
                        </div>
                      </div>
                      <div class="row gao60">
                        <div class="col-md-2 col-xs-2 wid_101 juzhong">
                            加班类别：
                        </div>
                        <div class="col-md-8 col-xs-8">
                            <select name="" class="wid_369 gao50 jblb">
                                <option value="">请选择</option>
                                <option value="工作日加班">工作日加班</option>
                                <option value="双休日加班">双休日加班</option>
                                <option value="节假日加班">节假日加班</option>
                            </select>
                        </div>
                      </div>
    
                      <div class="row gao60">
                        <div class="col-md-2 col-xs-2 wid_101 juzhong">
                            加班时长：
                        </div>
                        <div class="col-md-8 col-xs-8">
                            <input type="text"  class="leixing jb_time" placeholder="请输入加班时长" >
                        </div>
                      </div>
                </div>
                <div class="modal-footer">
                  <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                  <button type="button" class="btn btn-primary" id="addBox">保存</button>
                </div>
              </div><!-- /.modal-content -->
            </div><!-- /.modal-dialog -->
          </div><!-- /.modal -->
    </div>

    <div id="motaikuang2">

    </div>
</body>


<script>
    let count=5; //每一页的条数
    let page=1; //当前页
    let maxPage;//最大页

    //新增
    $('#addBox').on('click',function(){
        let a1=$(this).parent().prev().find('.yuangong_id').val();
        let b1=$(this).parent().prev().find('.yuangong_name').val();
        let c1=$(this).parent().prev().find('.jblb').val();
        let d1=$(this).parent().prev().find('.jb_time').val();
      
        console.log(a1);
        console.log(b1);
        console.log(c1);
        console.log(d1);
       
        $.ajax({
            url:"/add_jiaban",
            method:"post",
            data:{
                // id:change_table.parents('tr').attr('data-id'),
                yuangong_id:a1,
                yuangong_name:b1,
                jblb:c1,
                jb_time:d1
            },
            success:function(res){
                console.log(res);
                getData();
                alert("新增成功！");
            }
        })
        $('.fade').css({ display: 'none' });
    })


    //初始查询
    getData();
    function getData(){
        $.ajax({
            url:"/get_jiaban",
            data:{
                count:count,
                page:page
            },
            success:function(res){
                console.log(res);
                if(res.error){
                    console.log(res.error);
                }else{
                    $('#mytable tbody').html('');
                    $(res.data).each(function(i,item){
                        $('#motaikuang1').append(`  
                <div class="modal fade" tabindex="-1" role="dialog" id="shanchu_table${item.jb_num}">
                    <div class="modal-dialog" role="document">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                <h4 class="modal-title">是否要确认删除账户${item.yuangong_id}的数据</h4>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                                <button type="button" class="btn btn-primary yes">确定</button>
                            </div>
                        </div>
                    </div>
                </div>
            `)

            // let abc =  item.shuaka_time
            // console.log(typeof abc)
            // console.log(abc.substring(0,abc.length - 5))
                        $('#mytable tbody').append(`
                            <tr data-id="${item.jb_num}">
                                <td>${item.jb_num}</td>
                                <td>${item.yuangong_id}</td>
                                <td>${item.yuangong_name}</td>
                                <td>${item.jblb}</td>
                                
                                <td>${item.jb_time}</td>
                                <td>
                                    <span class="shanchu_table change" type="button" data-toggle="modal" data-target="#xiougai_table${item.jb_num}">编辑</span>
                                    <span class="shanchu_table del" type="button" data-toggle="modal" data-target="#shanchu_table${item.jb_num}">删除</span>
                                </td>
                            </tr>
                        `)

                        $('#motaikuang2').append(`  
                <div class="modal fade" tabindex="-1" role="dialog" id="xiougai_table${item.jb_num}">
                    <div class="modal-dialog" role="document">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                <h4 class="modal-title">是否要确认修改${item.yuangong_name}的编号为${item.jb_num}的加班的数据</h4>
                            </div>
                            <div class="modal-body">
                                <div class="row gao60">
                        <div class="col-md-2 col-xs-2 wid_101 juzhong">
                            工号：
                        </div>
                        <div class="col-md-8 col-xs-8">
                            <input type="text"  class="leixing item_yuangong_id" placeholder="请输入员工ID" value="${item.yuangong_id}">
                        </div>
                      </div>
    
                      <div class="row gao60">
                        <div class="col-md-2 col-xs-2 wid_101 juzhong">
                            姓名：
                        </div>
                        <div class="col-md-8 col-xs-8">
                            <input type="text"  class="leixing item_yuangong_name" placeholder="请输入姓名" value="${item.yuangong_name}">
                        </div>
                      </div>
                      <div class="row gao60">
                        <div class="col-md-2 col-xs-2 wid_101 qjlb">
                            加班类别：
                        </div>
                        <div class="col-md-8 col-xs-8">
                            <select name="" class="wid_369 gao50 item_jblb">
                                <option value="${item.jblb}">${item.jblb}</option>
                                <option value="工作日加班">工作日加班</option>
                                <option value="双休日加班">双休日加班</option>
                                <option value="节假日加班">节假日加班</option>
                            </select>
                        </div>
                      </div>
    
                      <div class="row gao60">
                        <div class="col-md-2 col-xs-2 wid_101 jb_time">
                            加班时长：
                        </div>
                        <div class="col-md-8 col-xs-8">
                            <input type="tex"  class="leixing item_jb_time" placeholder="请输入加班时长" value="${item.jb_time}">
                        </div>
                      </div>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                                <button type="button" class="btn btn-primary">确定</button>
                            </div>
                        </div>
                    </div>
                </div>
            `)
                    })
                }




                $('#pages').html('');
                $('#pages').append(`
                    <li id="pre">
                        <a href="#" aria-label="Previous">
                            <span aria-hidden="true">&laquo;</span>
                        </a>
                    </li>
                `)
                for (let i = 0; i < $('.page').length; i++) {
                    $('.page').eq(i).removeClass('active')
                }
                $('.page').eq(page-1).addClass('active');

                for(let i=1;i<=Math.ceil((res.total/count));i++){
                    maxPage = Math.ceil(res.total/count);
                    console.log(maxPage);
                    if(page==1){
                        $('#pages').append(`
                            <li class="ps"><a class="active" href="javascript:;">${i}</a></li>
                        `) 
                    }else{
                        $('#pages').append(`
                            <li class="ps"><a href="javascript:;">${i}</a></li>
                        `) 
                    }
                }
                $('#pages').append(`
                    <li id="next">
                        <a href="#" aria-label="Next">
                            <span aria-hidden="true">&raquo;</span>
                        </a>
                    </li>
                `)
            }
        })
    }


     //点击页码
$('#pages').on('click','.ps',function(){
    console.log($(this).text());
    // $(this).addClass('active');
    page=$(this).text();
    console.log(page);
    getData();
})


//上一页
$('#pages').on('click','#pre',function () {
    if(page != 1 && page != 0){
        page = parseInt(page) - 1
        console.log(page);
        getData();
    }
})

 //下一页
 $('#pages').on('click','#next',function () {
    if(page != maxPage && page != 0){
        // console.log(page)
        // console.log(maxPage)
        page = parseInt(page) + 1
        console.log(page);
        getData();
    }
 })


 let del_table    //设置指代的变量
$('#mytable tbody').on('click','.del',function (){
    del_table = $(this)
})
$('#motaikuang1').on('click', '.yes', function() {
    console.log(del_table.parents('tr').attr('data-id'));
    $.ajax({
        url:'/del_jiaban',
        method:'post',
        data:{
            id:del_table.parents('tr').attr('data-id')
        },
        success:(res)=>{
            console.log(res);
            if(res.error){
                console.log(res.msg)
            }else{
                alert('删除成功');
                getData();
            }
        }
    })
    $('.fade').css({ display: 'none' })
})


//修改
let change_table    //设置指代的变量
let a
let b
let c
let d
let s
$('#mytable tbody').on('click','.change',function (){
    change_table = $(this)
    // a = $(this).parent().prev().prev().text();
    // b = $(this).parent().prev().text();
    // $('#motaikuang2').find('#user_name').val()=a;
    // $('#motaikuang2').find('#user_password').val()=b;
    // console.log(a);
    // console.log(b);
    // console.log($('#motaikuang2').find('#user_name').val());
    // console.log($('#motaikuang2').find('#user_password').val());
})
$('#motaikuang2').on('click', '.btn-primary', function() {
    console.log(change_table.parents('tr').attr('data-id'));
    
    a=$(this).parent().prev().find('.item_yuangong_id').val();
    b=$(this).parent().prev().find('.item_yuangong_name').val();
    c=$(this).parent().prev().find('.item_jblb').val();
    d=$(this).parent().prev().find('.item_jb_time').val();
    console.log(a);
    console.log(b);
    console.log(c);
    console.log(d);
    
    $.ajax({
        url:'/change_jiaban',
        method:'post',
        data:{
            id:change_table.parents('tr').attr('data-id'),
            yuangong_id:a,
            yuangong_name:b,
            jblb:c,
            jb_time:d
        },
        success:(res)=>{
            console.log(res);
            if(res.error){
                console.log(res.msg)
            }else{
                alert('修改成功!');
                getData();
            }
        }
    })
    // $(this).parent().prev().find('#user_name').val('');
    // $(this).parent().prev().find('#user_password').val('');
    $('.fade').css({ display: 'none' })
})


//重置
$('#reset').on('click',function(){
    $('#sousuo_id').val('');
    $('#sousuo_name').val('');
    // $('#sousuo_jcbs').val('');
    getData();
})

//搜索
$('#ss').on('click',function(){
    let a2=$('#sousuo_id').val();
    let b2=$('#sousuo_name').val();
    // let s2=$('#sousuo_jcbs').val();
    let pageA=1;
    let countA=5;

    $.ajax({
            url:"/sousuo_jiaban",
            data:{
                page:pageA,
                count:countA,
                yuangong_id:a2,
                yuangong_name:b2,
                // jcbs:s2
            },
            success:function(res){
                console.log(res);
                if(res.error){
                    console.log(res.error);
                }else{
                    $('#mytable tbody').html('');
                    $(res.data).each(function(i,item){
                        $('#motaikuang1').append(`  
                <div class="modal fade" tabindex="-1" role="dialog" id="shanchu_table${item.jb_num}">
                    <div class="modal-dialog" role="document">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                <h4 class="modal-title">是否要确认删除账户${item.yuangong_id}的数据</h4>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                                <button type="button" class="btn btn-primary yes">确定</button>
                            </div>
                        </div>
                    </div>
                </div>
            `)

            // let abc =  item.shuaka_time
            // console.log(typeof abc)
            // console.log(abc.substring(0,abc.length - 5))
                        $('#mytable tbody').append(`
                            <tr data-id="${item.jb_num}">
                                <td>${item.jb_num}</td>
                                <td>${item.yuangong_id}</td>
                                <td>${item.yuangong_name}</td>
                                <td>${item.jblb}</td>
                                
                                <td>${item.jb_time}</td>
                                <td>
                                    <span class="shanchu_table change" type="button" data-toggle="modal" data-target="#xiougai_table${item.jb_num}">编辑</span>
                                    <span class="shanchu_table del" type="button" data-toggle="modal" data-target="#shanchu_table${item.jb_num}">删除</span>
                                </td>
                            </tr>
                        `)

                        $('#motaikuang2').append(`  
                <div class="modal fade" tabindex="-1" role="dialog" id="xiougai_table${item.jb_num}">
                    <div class="modal-dialog" role="document">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                <h4 class="modal-title">是否要确认修改${item.yuangong_name}的编号为${item.jb_num}的加班的数据</h4>
                            </div>
                            <div class="modal-body">
                                <div class="row gao60">
                        <div class="col-md-2 col-xs-2 wid_101 juzhong">
                            工号：
                        </div>
                        <div class="col-md-8 col-xs-8">
                            <input type="text"  class="leixing item_yuangong_id" placeholder="请输入员工ID" value="${item.yuangong_id}">
                        </div>
                      </div>
    
                      <div class="row gao60">
                        <div class="col-md-2 col-xs-2 wid_101 juzhong">
                            姓名：
                        </div>
                        <div class="col-md-8 col-xs-8">
                            <input type="text"  class="leixing item_yuangong_name" placeholder="请输入姓名" value="${item.yuangong_name}">
                        </div>
                      </div>
                      <div class="row gao60">
                        <div class="col-md-2 col-xs-2 wid_101 qjlb">
                            加班类别：
                        </div>
                        <div class="col-md-8 col-xs-8">
                            <select name="" class="wid_369 gao50 item_jblb">
                                <option value="${item.jblb}">${item.jblb}</option>
                                <option value="工作日加班">工作日加班</option>
                                <option value="双休日加班">双休日加班</option>
                                <option value="节假日加班">节假日加班</option>
                            </select>
                        </div>
                      </div>
    
                      <div class="row gao60">
                        <div class="col-md-2 col-xs-2 wid_101 jb_time">
                            加班时长：
                        </div>
                        <div class="col-md-8 col-xs-8">
                            <input type="tex"  class="leixing item_jb_time" placeholder="请输入加班时长" value="${item.jb_time}">
                        </div>
                      </div>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                                <button type="button" class="btn btn-primary">确定</button>
                            </div>
                        </div>
                    </div>
                </div>
            `)
                    })
                }




                $('#pages').html('');
                $('#pages').append(`
                    <li id="pre">
                        <a href="#" aria-label="Previous">
                            <span aria-hidden="true">&laquo;</span>
                        </a>
                    </li>
                `)
                for (let i = 0; i < $('.page').length; i++) {
                    $('.page').eq(i).removeClass('active')
                }
                $('.page').eq(page-1).addClass('active');

                for(let i=1;i<=Math.ceil((res.total/count));i++){
                    maxPage = Math.ceil(res.total/count);
                    console.log(maxPage);
                    if(page==1){
                        $('#pages').append(`
                            <li class="ps"><a class="active" href="javascript:;">${i}</a></li>
                        `) 
                    }else{
                        $('#pages').append(`
                            <li class="ps"><a href="javascript:;">${i}</a></li>
                        `) 
                    }
                }
                $('#pages').append(`
                    <li id="next">
                        <a href="#" aria-label="Next">
                            <span aria-hidden="true">&raquo;</span>
                        </a>
                    </li>
                `)
            }
        })
})
</script>
</html>